<template>
	<div class="article-box">
		<uv-navbar :fixed="false" :placeholder="true" bg-color="transparent" @leftClick="back">
			<image slot="left" src="https://www.guizhouqy.com/mini/back.png" style="width: 48rpx;height: 48rpx;">
			</image>
			<text slot="center" style="font-weight: bold;font-size: 32rpx;color: #FFFFFF;">协议介绍</text>
		</uv-navbar>
		<div class="content">
			<rich-text :nodes="articleInfo.content"></rich-text>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				articleInfo: {}
			}
		},
		onLoad(options) {
			const { id } = options
			this.getPlatformInfo(id)
		},
		mounted() {

		},
		methods: {
			// 根据id获取协议 目前后台协议是维护文章板块
			async getPlatformInfo(id) {
				let res = await this.$api.common.getArticleInfo.get({id})
				if (res.code == 0) {
					this.articleInfo = res.data
				} else {
					this.$tool.error(res.msg)
				}
			},
			back() {
				uni.navigateBack()
			}
		}
	}
</script>

<style>
	uni-page-body,
	page {
		background-color: rgba(36, 15, 65, 1);
		min-height: 100%;
	}

	.article-box .title {
		padding: 0 15px;
		font-size: 17px;
		color: #282828;
		font-weight: 700;
		margin: 22px 0 11px 0;
		line-height: 1.5;
	}

	.description {
		margin: 0 15px;
		padding-bottom: 12px;
		align-items: center;
		display: flex;
	}

	.description .label {
		font-size: 12px;
		color: #b1b2b3;
	}

	.description .item {
		margin-left: 13px;
		font-size: 12px;
		color: #b1b2b3;
	}

	.content {
		padding: 0 15px;
		font-size: 14px;
		color: #ffffff;
		line-height: 1.7;
	}
</style>